import { FC } from "react"
import styles from "./index.less"

/**
 * 数据统计
 * @returns 
 */

export interface CardPro {
  title: string,
  value: number
}

interface DataStatisticsPro {
  list: Array<CardPro>
}

const dataStatistics: FC<DataStatisticsPro> = ({ list }) => {
  return (
    <div className={styles.cardBox}>
      {
        list.map((item: CardPro) => {
          return (
            <div className={styles.cardBody}
              key={item.title}
              style={{ width: `${100 / (list.length)}%` }}>
              <p className={styles.title}>{item.title}：</p>
              <div className={styles.value}>{item.value}</div>
            </div>
          )
        })
      }
    </div>
  )
}

export default dataStatistics